<template>
  <div>
    <div class="recordingDiv">
      录音时长上限:<el-input-number
      class="recordingTime"
      v-model="audioTime"
      :max="99"
      :min="3"
      placeholder="3"
    />
      分钟
    </div>
    <div class="footerBtn">
      <el-button class="footerBtnSave" type="primary" @click="save"
      >保 存</el-button
      >
      <el-button @click="cancel">返 回</el-button>
    </div>
  </div>
</template>

<script>
import { listLimit, getLimit, uPrecordingLimit } from "@/api/ywjy/limit";
export default {
  name: "AudioTime",
  data() {
    return {
      audioTime: 3,
      recordingLimitId: "",
      recordingList: [], //获取音乐时长详细信息
      queryParams: {
        recordingLimitId: "" //	Long	录音时长上限id
        // recordingLimit: "", //	int	录音时长上限（分钟)
        // createdBy: "", //	Long	创建人
        // createTime: "", //	string	创建时间
        // updateUid: "", //	Long	更新者
        // updateTime: "", //	Date	更新时间
        // deleteFlag: "", //删除状态:0=否;1=是
      }
    };
  },
  mounted() {
    this.getRecording();
  },
  methods: {
    //获取音频时长的相关信息
    getRecording() {
      listLimit(this.queryParams).then(res => {
        if (res.rows && res.rows.length > 0) {
          console.log(res.rows[0].recordingLimitId);
          this.recordingLimitId = res.rows[0].recordingLimitId;
          this.getLimit(this.recordingLimitId);
        } else {
          this.recordingLimitId = "";
        }
      });
    },

    // 查询录音时长上限详细
    getLimit(id) {
      getLimit(id).then(res => {
        if (res.data) {
          this.audioTime = res.data.recordingLimit;
        }
      });
    },

    //点击保存按钮
    save() {
      const recordingLimit = this.audioTime;

      if (recordingLimit > 99) {
        this.msgError("上限输入99分钟,请重新输入");
        return false;
      }

      let data = {
        recordingLimitId: this.recordingLimitId,
        recordingLimit: this.audioTime
      };

      this.$confirm(`确认修改录音上限时长为${recordingLimit}分钟吗?`, {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        center: true
      })
        .then(function() {
          return uPrecordingLimit(data);
        })
        .then(() => {
          this.getRecording();
          this.msgSuccess("修改上限时长成功");
        })
        .catch(() => {
          this.msgError("修改上限时长失败,请重试");
          this.getLimit(this.recordingLimitId);
        });
    },
    //点击取消按钮
    cancel() {}
  }
};
</script>

<style lang="scss" scoped>
.recordingDiv {
  margin: 100px 0 200px 0;
  display: flex;
  justify-content: center;
  align-items: center;
  .recordingTime {
    width: 200px;
    margin-left: 10px;
  }
}
.footerBtn {
  display: flex;
  justify-content: center;
  align-items: center;
  .footerBtnSave {
    margin-right: 30px;
  }
}
</style>
